<div class="margin-bottom-20 ">
  <button id="btn-load-more" type="button" class="btn btn-sm btn-lg btn-block">点击加载更多</button>
</div>

<script>
  var PAGE_SIZE = <%= pageSize%>
  var PAGE_INDEX =  <%= pageIndex%>
  var COUNT =  <%= count%>
  var $btnLoadMore = $('#btn-load-more')
  var $containerWeiboList = $('<%= containerSelector%>')
  var api = '<%= api%>'

  // 加载更多
  $btnLoadMore.click(function () {
      var nextPageIndex = PAGE_INDEX + 1
      ajax.get(api + '/' + nextPageIndex, function(err, data) {
          if (err) {
              // 失败
              alert(err)
              return
          }
          // 更新 pageIndex
          PAGE_INDEX = data.pageIndex

          // 是否要隐藏“加载更多”
          if ((PAGE_INDEX + 1) * PAGE_SIZE >= COUNT) {
              $btnLoadMore.hide()
          }

          // 渲染页面
          var $tempContainer = $(data.blogListTpl)
          $tempContainer.each(function (index, item) {
              if (item.nodeType !== 1) {
                  // 不是 DOM 元素，是其他（如 #TEXT 类型）
                  return
              }
              $containerWeiboList.append($(item))
          })
      })
  })
</script>
